<template>
  <div>




    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="菜单(权限)名称">
        <el-input v-model="form.menuName"></el-input>
      </el-form-item>

      <el-form-item label="url">
        <el-input v-model="form.url"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
      </el-form-item>
    </el-form>






  </div>
</template>

<script>


import service from "@/utils/request.js";

export default {
  name:'MenuEdit',
  props:["id",'pid'],
  data(){
    return{
      form:{
        // id:'',
        menuName:'',
        url:'',
        parentId:''
      }
    }
  },
  methods:{
    onSubmit(){
      //校验表单，

      // 提交 表单 post
      console.log(this.form);

      // delete this.form["children"]

      service.post('/menu/saveOrUpdate',this.form).then((success)=>{

        if(success){
          this.$message({
            message: '保存成功',
            type: 'success'
          });
          this.$emit("update:visible",false); //关闭对话框
          this.$emit("flush"); //发起刷新事件
        }
      })

    },

    //修改的时候初始化页面
    init(){
      console.log("id-------init-------",this.id)
      console.log("type------init--------",typeof this.id)


      if(this.id){ //如果有id则需要查询对应的数据
        // let idstr = this.id;
        // service.post('/menu/getById',this.id).then((menu)=>{
        service.post('/menu/getById'+this.id).then((menu)=>{
          // console.log("res ------------",menu)
          // this.form = menu;

          let {menuId,menuName,url,parentId} = menu;
          parentId = parentId?parentId:'';
          this.form = {
            menuId,
            menuName,
            url,
            parentId
          }
        })
      }else{
        //设置下 上级菜单id
        this.form.parentId = this.pid;
      }
    }
  },
  created() {
    this.init()

    console.log("form ------------",this.form)
  }

}
</script>

<style>
</style>